<template>
  <!-- 网络共享下拉菜单 -->
  <el-dropdown :disabled="floating">
    <!-- 网络共享启动按钮和状态显示 -->
    <div
      class=""
      :title="device.$gnirehtetLoadingText"
      @click="handleStart"
      @mouseenter="onMouseenter"
    >
      <!-- 插槽用于自定义加载状态 -->
      <slot :loading="device.$gnirehtetLoading" />
    </div>

    <!-- 当网络共享服务正在运行时显示下拉菜单 -->
    <template v-if="device.$gnirehtetLoading" #dropdown>
      <el-dropdown-menu>
        <!-- 停止网络共享服务的选项 -->
        <el-dropdown-item @click="handleStop">
          {{ $t('device.control.gnirehtet.stop') }}
        </el-dropdown-item>
      </el-dropdown-menu>
    </template>
  </el-dropdown>
</template>

<script>
import { sleep } from '$/utils'
import { adaptiveMessage } from '$/utils/modal/index.js'

export default {
  props: {
    // 设备对象，包含网络共享服务的加载状态和文本
    device: {
      type: Object,
      default: () => ({}),
    },
    // 是否处于浮动状态，用于控制某些功能是否可用
    floating: {
      type: Boolean,
      default: false,
    },
  },
  data() {
    return {}
  },
  created() {
    // 确保设备对象包含网络共享服务的加载状态和文本属性
    if (!Object.hasOwnProperty.call(this.device, '$gnirehtetLoading')) {
      Object.assign(this.device, {
        $gnirehtetLoading: false,
        $gnirehtetLoadingText: '',
      })
    }
  },
  methods: {
    /**
     * 当鼠标进入网络共享启动按钮区域时的处理函数
     * 在浮动状态下，如果网络共享服务正在运行，则显示停止服务的选项
     */
    onMouseenter() {
      if (!this.floating) {
        return false
      }

      if (!this.device.$gnirehtetLoading) {
        return false
      }

      // 监听停止网络共享服务的事件，并调用 handleStop 方法
      window.electron.ipcRenderer.once(
        'stop-device-gnirehtet',
        (event, data) => {
          this.handleStop()
        },
      )

      // 定义并显示包含停止网络共享服务选项的菜单
      const options = [
        {
          label: window.t('device.control.gnirehtet.stop'),
          value: 'stop-device-gnirehtet',
        },
      ]

      window.electron.ipcRenderer.send('open-device-gnirehtet-menu', {
        options,
      })
    },
    /**
     * 获取偏好设置数据的函数
     * @param {...args} args - 偏好设置的参数
     * @returns {any} 偏好设置的数据
     */
    preferenceData(...args) {
      return this.$store.preference.getData(...args)
    },
    /**
     * 启动网络共享服务的处理函数
     * 如果网络共享服务已经在运行，则不执行任何操作
     */
    async handleStart() {
      if (this.device.$gnirehtetLoading) {
        return false
      }

      // 设置网络共享服务的加载状态和文本
      this.device.$gnirehtetLoadingText = this.$t(
        'device.control.gnirehtet.running',
      )
      this.device.$gnirehtetLoading = true

      try {
        // 启动网络共享服务并显示成功消息
        await this.$gnirehtet.run(this.device.id)
        await sleep()
        adaptiveMessage(this.$t('device.control.gnirehtet.start.success'), {
          system: this.floating,
          type: 'success',
        })
      }
      catch (error) {
        // 如果启动失败，显示错误消息并重置加载状态
        this.$message.warning(error.message || 'Start service failure')
        this.device.$gnirehtetLoading = false
        this.device.$gnirehtetLoadingText = ''
      }
    },
    /**
     * 停止网络共享服务的处理函数
     * 设置停止服务的文本并根据结果显示消息
     */
    async handleStop() {
      // 设置网络共享服务的加载状态和文本
      this.device.$gnirehtetLoadingText = this.$t(
        'device.control.gnirehtet.stopping',
      )

      try {
        // 停止网络共享服务并显示成功消息
        await this.$gnirehtet.stop(this.device.id)
        await sleep()
        adaptiveMessage(this.$t('common.success'), {
          system: this.floating,
          type: 'success',
        })
      }
      catch (error) {
        // 如果停止失败，显示错误消息
        adaptiveMessage(error.message || 'Stop service failure', {
          system: this.floating,
          type: 'warning',
        })
      }

      // 无论成功还是失败，重置加载状态和文本
      this.device.$gnirehtetLoading = false
      this.device.$gnirehtetLoadingText = ''
    },
  },
}
</script>

<style></style>
